<template>
	<div class="resume-toolbar">
		<div class="dropdown fontfamily">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#">
             <span class="FontName">Arial</span> <span class="caret"></span>
          </a>
          <!-- <ul class="dropdown-menu">
             <li><a href="javascript:;" class="editors" data-param="Arial">Arial</a></li>
             <li><a href="javascript:;" class="editors" data-param="宋体">宋体</a></li>
             <li><a href="javascript:;" class="editors" data-param="微软雅黑">微软雅黑</a></li>
             <li><a href="javascript:;" class="editors" data-param="黑体">黑体</a></li>	             
          </ul> -->
        </div>
		<div class="dropdown fontsize">
          <a class="dropdown-toggle" href="#">
             <span class="FontSize">3</span> <span class="caret"></span>
          </a>
          <!-- <ul class="dropdown-menu">
             <li><a href="javascript:;"  class="editors" data-param="1">1</a></li>
             <li><a href="javascript:;"  class="editors" data-param="2">2</a></li>
             <li><a href="javascript:;"  class="editors" data-param="3">3</a></li>
             <li><a href="javascript:;"  class="editors" data-param="4">4</a></li>
             <li><a href="javascript:;"  class="editors" data-param="5">5</a></li>
             <li><a href="javascript:;"  class="editors" data-param="6">6</a></li>
             <li><a href="javascript:;"  class="editors" data-param="7">7</a></li>	         
          </ul> -->
        </div>
		<div class="barbtn">
			<a href="javascript:void(0);" class="editors"><span class="bold tipstool" title="加粗"></span></a>
			<a href="javascript:void(0);" class="editors"><span class="italic tipstool" title="倾斜"></span></a>
			<a href="javascript:void(0);" class="editors"><span class="underline tipstool" title="下划线"></span></a>
			<a href="javascript:void(0);" class=""><span class="bgcolor tipstool qfontcolor" title="背景色">A</span></a>
			<a href="javascript:void(0);"><span class="fontcolor tipstool qfontcolor" title="字体颜色"><em></em></span></a>
			<a href="javascript:void(0);" class="editors mp"><span class="align-left tipstool" title="左对齐"></span></a>
			<a href="javascript:void(0);" class="editors mp"><span class="align-center tipstool" title="居中对齐"></span></a>
			<a href="javascript:void(0);" class="editors mp"><span class="align-right tipstool" title="右对齐"></span></a>
			<a href="javascript:void(0);" class="editors mp"><span class="RemoveFormat tipstool" title="清除格式"></span></a>
		</div>
	</div>
</template>

<script>

export default {




}
</script>

<style>
.resume-toolbar{width:640px; height:38px; background: #fff; position: absolute; top: auto; left: auto; z-index: 109; display:block; padding: 0 16px; border-radius: 20px;}
.resume-toolbar .fontsize{width:85px; height:28px; line-height:28px; float:right; border:1px solid #e1e1e1}
.resume-toolbar .barbtn{float: left; height: 22px; padding: 8px 0;}
.resume-toolbar .barbtn a{display:block; float:left; text-align:center; font-size:15px; color:#000;font-weight:normal}
.resume-toolbar .barbtn span{display:block; width:22px; height:22px; background:url(../../assets/images/icosz.png) no-repeat; margin-right:12px;}
.resume-toolbar .barbtn span.bold{background-position:-89px -9px}
.resume-toolbar .barbtn span.italic{background-position:-125px -9px}
.resume-toolbar .barbtn span.underline{background-position:-163px -9px;}
.resume-toolbar .barbtn span.bgcolor{background: none; margin:0 20px 0 10px; background:rgba(0,0,0,.1); color: #000;}
.resume-toolbar .barbtn span.fontcolor{background-position:-255px -9px; width:30px; position:relative}
.resume-toolbar .barbtn span.fontcolor em{display:block; width:18px; height:3px; overflow:hidden; position:absolute; background:#F00; top:18px; left:-2px;}
.resume-toolbar .barbtn span.align-left{background-position:-92px -50px}
.resume-toolbar .barbtn span.align-center{background-position:-148px -50px}
.resume-toolbar .barbtn span.align-right{background-position:-210px -50px}
.resume-toolbar .barbtn span.list-ul{background-position:-92px -89px}
.resume-toolbar .barbtn span.list-ol{background-position:-182px -89px}
.resume-toolbar .barbtn span.RemoveFormat{background-position:-270px -52px}
.resume-toolbar .barbtn .mp{ margin: 0 3px;}
.resume-toolbar .caret{ position:absolute; top:12px; right:8px;}
.resume-toolbar .fontfamily{width:100px;margin-top: 4px; height:30px; line-height:30px; float:left; border:1px solid #e1e1e1; margin-right: 10px;}
.resume-toolbar .dropdown-toggle{position:relative; display:block; padding-left:12px; height:30px; line-height:30px; font-size: 14px; color: #333;}
.resume-toolbar .dropdown-menu{width:100%; min-width:100%}
.resume-toolbar .fontsize{ float: left;margin-top: 4px; margin-right: 10px;height:30px; line-height:30px;width:50px; }

/*颜色*/
.bigpicker{width:227px; height:163px; position: absolute; z-index: 9999; background-color: #F0F0F0; padding: 2px 0 1px 5px; border-left: solid 1px #CCCCCC; border-top: solid 1px #CCCCCC; border-right: solid 1px #565656; border-bottom: solid 1px #565656; display: none;}
.bigpicker-sections-color{margin: 0; padding: 0;}
.bigpicker-sections-color ul{margin: 0; padding: 0; float: left;}
.bigpicker-sections-color ul li{list-style: none outside none; margin: 0; padding: 0; border-top:solid 1px #000000; border-left:solid 1px #000000; width:10px; height: 10px; overflow:hidden; line-height:0px; font-size:0px;	}
.bigpicker .biglayout{width:10px; height:10px; border:solid 1px #FFFFFF; position: absolute; z-index: 10000; display: none; line-height: 10px; overflow: hidden; cursor: default;}
.bigpicker-bgview-text{margin: 0; padding: 0; height: 24px;}
.bigpicker-bgview-text li{padding: 0 5px 0 0 ; list-style: none outside none; float: left; line-height:18px;}
.bigpicker-bgview-text li div{margin: 0; padding: 0; height: 20px; width: 55px; background-color: #000000; border-left: solid 1px #CCCCCC; border-top: solid 1px #CCCCCC; border-right: solid 1px #2B2B2B; border-bottom: solid 1px #2B2B2B;}
.bigpicker-bgview-text li input{margin: 0; padding: 0; height: 17px; width: 55px;}
.bigpicker-bgimage{background-image:url(../../assets/images/big_bgcolor.jpg);}
/*提示*/
.tips-black{opacity:0.8; z-index:1000; text-align:left; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding:8px 8px; color:#fff; background-color:#000;}
.tips-black .tip-inner{font:11px/12px 'Lucida Grande',sans-serif;}
/*.tips-black .tip-arrow-bottom{margin-top:0; margin-left:-5px; top:100%; left:50%; width:9px; height:5px; background:url(../images/tip_arrows.gif) no-repeat -18px 0;}*/
</style>